import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/widgets.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:senkoo_platform/Utils/base_standard.dart';
import 'package:senkoo_platform/Utils/base_text.dart';
import 'package:senkoo_platform/Utils/color.dart';
import 'package:senkoo_platform/Utils/hex_color_utils.dart';
import 'package:senkoo_platform/base_router/base_router_util.dart';
import 'package:senkoo_platform/views/operate_modular/material_management_page.dart';
import 'package:senkoo_platform/views/operate_modular/schedule_management_page.dart';
import 'package:senkoo_platform/views/operate_modular/template_management_page.dart';

class OperatePage extends StatefulWidget {
  const OperatePage({
    super.key,
  });

  @override
  State<OperatePage> createState() => _OperatePageState();
}

class _OperatePageState extends State<OperatePage> {
  int _selectedIndex = 0;

  List modularList = [
    {'index': 0, 'page': const MaterialManagementPage()},
    {'index': 1, 'page': const TemplateManagementPage()},
    {'index': 2, 'page': const ScheduleManagementPage()},
  ];

  @override
  Widget build(BuildContext context) => Container(
        child: Stack(
          children: [
            Positioned(
                child: Container(
              width: 300.w,
              decoration: const BoxDecoration(
                  gradient: LinearGradient(
                colors: [Color(0x00101423), Color(0xFF171D34)],
                begin: Alignment.centerRight,
                end: Alignment.centerLeft,
              )),
            )),
            Row(
              mainAxisSize: MainAxisSize.max,
              children: [leftWidget(), rightWidget()],
            )
          ],
        ),
      );

  Widget textWidget(String string) => text(
        textString: string,
        textColor: Standard.colorFFFFFF,
        textSize: 12.sp,
      );

  Widget leftWidget() => Container(
        width: 162.w,
        color: Colors.transparent,
        child: NavigationRail(
          useIndicator: true,
          elevation: 1,
          selectedIndex: _selectedIndex,
          onDestinationSelected: (int index) {
            setState(() {
              _selectedIndex = index;
            });
          },
          labelType: NavigationRailLabelType.all,
          backgroundColor: Colors.transparent,
          destinations: <NavigationRailDestination>[
            NavigationRailDestination(
              icon: SizedBox(
                width: 114.w,
                height: 70.h,
                child: Center(
                  child: text(
                      textString: '节目\n素材管理',
                      textColor: Standard.colorFFFFFF,
                      textWeight: FontWeight.w800,
                      textAligin: textAlignCenter,
                      textSize: 18.sp),
                ),
              ),
              selectedIcon: Container(
                width: 114.w,
                height: 70.h,
                decoration: const BoxDecoration(
                    gradient: LinearGradient(
                  colors: [Color(0xFF237EF1), Color(0xFF1C3EF3)],
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                )),
                child: Center(
                  child: text(
                      textString: '节目\n素材管理',
                      textColor: Standard.colorFFFFFF,
                      textWeight: FontWeight.w800,
                      textAligin: textAlignCenter,
                      textSize: 18.sp),
                ),
              ),
              label: Container(),
            ),
            NavigationRailDestination(
              icon: SizedBox(
                width: 114.w,
                height: 70.h,
                child: Center(
                  child: text(
                      textString: '节目\n模版管理',
                      textColor: Standard.colorFFFFFF,
                      textWeight: FontWeight.w800,
                      textAligin: textAlignCenter,
                      textSize: 18.sp),
                ),
              ),
              selectedIcon: Container(
                width: 114.w,
                height: 70.h,
                decoration: const BoxDecoration(
                    gradient: LinearGradient(
                  colors: [Color(0xFF237EF1), Color(0xFF1C3EF3)],
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                )),
                child: Center(
                  child: text(
                      textString: '节目\n模版管理',
                      textColor: Standard.colorFFFFFF,
                      textWeight: FontWeight.w800,
                      textAligin: textAlignCenter,
                      textSize: 18.sp),
                ),
              ),
              label: Container(),
            ),
            NavigationRailDestination(
              icon: SizedBox(
                width: 114.w,
                height: 70.h,
                child: Center(
                  child: text(
                      textString: '节目\n排期管理',
                      textColor: Standard.colorFFFFFF,
                      textWeight: FontWeight.w800,
                      textAligin: textAlignCenter,
                      textSize: 18.sp),
                ),
              ),
              selectedIcon: Container(
                width: 114.w,
                height: 70.h,
                decoration: const BoxDecoration(
                    gradient: LinearGradient(
                  colors: [Color(0xFF237EF1), Color(0xFF1C3EF3)],
                  begin: Alignment.topCenter,
                  end: Alignment.bottomCenter,
                )),
                child: Center(
                  child: text(
                      textString: '节目\n排期管理',
                      textColor: Standard.colorFFFFFF,
                      textWeight: FontWeight.w800,
                      textAligin: textAlignCenter,
                      textSize: 18.sp),
                ),
              ),
              label: Container(),
            ),
          ],
          selectedIconTheme: IconThemeData(color: Colors.white, size: 40.w),
          unselectedIconTheme: IconThemeData(
            color: Standard.colorFFFFFF,
          ),
          indicatorColor: Colors.transparent,
          indicatorShape: const CircleBorder(),
        ),
      );
  Widget rightWidget() => Expanded(
        child: Container(
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(24.r),
                gradient: const LinearGradient(
                  colors: [Color(0xFF101423), Color(0xFF171D34)],
                  begin: Alignment.centerRight,
                  end: Alignment.centerLeft,
                )),
            child: modularList[_selectedIndex]['page']),
      );
}
